import { useNavigate, useLocation, MemoryRouter as Router, } from 'react-router-dom';
import bem from '@/utils/bem';
import NavBar from '@/components/navbar/navbar';
import './search.scss';

const SearchPage = () => {
    const b = bem('search');

    const navigate = useNavigate();
    const searchHandler = () => {
        console.log('searchHandler');
        navigate('/searchfilter');
    }
    return (
        <>
            <div className={b()}>
                <div className={b('header')}>
                    <NavBar
                        backIcon={true}
                        right={
                            <>
                                <button className={b('btn')}>搜索</button>
                            </>
                        }
                        style={{
                            borderBottom: '1px solid #e5e5e5'
                        }}
                        rightOnClick={searchHandler}
                    />
                </div>

                <div className={b('main')}>
                    <div className={b('history-last')}>
                        <div className={b('history-last-head')}>
                            <div className={b('history-last-head__title')}>搜索历史</div>
                            <div className={b('history-last-head__clear')}>清空</div>
                        </div>

                        <div className={b('history-last-tags')}>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>

                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机手机手机手机手机手机手机手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                        </div>
                    </div>

                    <div className={b('history-last')}>
                        <div className={b('history-last-head')}>
                            <div className={b('history-last-head__title')}>搜索发现</div>
                        </div>

                        <div className={b('history-last-tags')}>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>

                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机手机手机手机手机手机手机手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                            <div className={b('history-last-tags__item')}>手机</div>
                        </div>
                    </div>
                </div>
            </div>
        </>
    )
}

export default SearchPage;